<template>
<div class=" appCon t-center page_pos_style" :style="{ top: `${phoneStatusBarHeight}`}" style="padding:unset;">
  <!-- 顶部盒子 -->
    <!-- <van-nav-bar title="修改手机号" fixed placeholder :border="false"> data_new_box-->
      <!-- 顶部返回按钮 -->
      <!-- <template #left>
        <van-icon name="arrow-left" size="18" @click="$router.go(-1);" />
      </template>
    </van-nav-bar> -->
    <navbar :title="title"></navbar>
  <!-- this is find indexpage -->
  <van-field
    v-model="content"
	  label="+86"
	  class="marBtm"
    type="number"
    maxlength="12"
    placeholder="请输入新的手机号码"
    style="font-size: 16px;font-family: PingFangSC-Regular, PingFang SC;font-weight: 400;"
  />
  <!-- <van-button size="small" type="primary" class=" coll_80"  @click="save">下一步</van-button>	 -->
  
  <div class="but">
    <van-button block type="primary" style="color:#ffffff !important;font-size:16px !important;" @click="save">下一步</van-button>
  </div>
</div>

</template>

<script>
import { Toast } from 'vant'
export default { 
	name:'EditMobile',
	data(){
		return {
      // header栏 => 标题
      title:"修改手机号",

			content:'',
        // 获取屏幕状态栏高度
        phoneStatusBarHeight:''
		}
	},
	methods:{
		save(){
      //手机号验证正则
      const tel = /^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8}$/
      if(this.content == '' || !tel.test(this.content))  return  Toast("请输入正确的手机号码")
      this.$router.push({
        name:'msgAuthentication',
        query:{
          mobile:this.content
        }
      })
			/* let key = this.$route.query.ty
			if(key==='name'){
				
			}else if(key ==='remark'){
				
			}
			this.$router.go(-1) */
			// this.$router.push({name:'UserInfo'})
		}
	},
  created() {
      // 获取屏幕状态栏高度
      this.phoneStatusBarHeight = window.phoneStatusBarHeight
    document.title = "修改手机号"
  },
}
</script>

<style lang="less">
// .data_new_box{
  /* .van-cell{
    .van-field__label{
      font-size: 16px;
      font-family: PingFangSC-Regular, PingFang SC;
      font-weight: 400;
      // height: 100px;
      // width: 100%;
    }
    .van-cell__value {
      font-size: 16px;
      font-family: PingFangSC-Regular, PingFang SC;
      font-weight: 400;
      // height: 100px;
      // width: 100%;
    }
    .van-icon{
      font-size: 18px;
    }
  } */
  .but{
    margin: 20px 12px;
    .van-button{
      color: black !important;
      font-size: 17px;
      font-family: PingFang SC;
      font-weight: 500;
      color: #333333;
    }
  }
// }
</style>